/**
 * 定义的 type 必须在 form-widget 目录下存在
 *
 * 注意 props.value 字段是系统保留字段, 不要使用value作为业务字段, 否则在预览获取编辑组件值时
 * 会被覆盖
 *
 */
import { Field } from "./types"

export const containers = [
  {
    type: "grid",
    displayName: "栅格",
    category: "container",
    icon: "ant-design:table-outlined",
    cols: [],
    options: {
      name: "",
      hidden: false,
      gutter: 12,
      colHeight: null, //栅格列统一高度属性，用于解决栅格列设置响应式布局浮动后被挂住的问题！！
      customClass: "", //自定义css类名
    },
  },

  {
    type: "table",
    displayName: "表格",
    category: "container",
    icon: "ant-design:database-outlined",
    rows: [],
    options: {
      name: "",
      hidden: false,
      customClass: "", //自定义css类名
    },
  },

  {
    type: "tab",
    displayName: "标签页",
    category: "container",
    icon: "ant-design:tag-outlined",
    displayType: "border-card",
    tabs: [],
    options: {
      name: "",
      hidden: false,
      customClass: "", //自定义css类名
    },
  },
]

export const basicFields: Field[] = [
  {
    type: "input",
    category: "basicWidget",
    icon: "text-field",
    formItemFlag: true,
    useAsFormItem: true,
    settingForm: {
      labelWidth: "90px",
      labelAlign: "left",
    },
    props: {
      // 字段名称
      formItemField: "",
      formItemLabel: "",
      formItemRequired: true,
      formItemLabelAlign: "",
      formItemLabelTooltip: "",
      hidden: false,
      wrapperCol: {},

      placeholder: "请输入",
      disabled: false,
      readonly: false,
      allowClear: true,
      inputShowCount: true,
      defaultValue: "",
      addonBefore: "", // 前置标签
      addonAfter: "", // 后置标签
      maxLength: 10, // 最大长度
      bordered: true, // 是否有边框
    },
  },
  {
    type: "slot",
    icon: "slot",
    formItemFlag: true,
    useAsFormItem: true,
    settingForm: {
      labelWidth: "90px",
      labelAlign: "left",
    },
    props: {
      formItemField: "",
      formItemLabel: "",
      formItemRequired: false,
      formItemLabelAlign: "",
      formItemLabelTooltip: ""
    },
  },
  {
    type: "textarea",
    icon: "textarea-field",
    formItemFlag: true,
    useAsFormItem: true,
    settingForm: {
      labelWidth: "90px",
      labelAlign: "left",
    },
    props: {
      formItemField: "",
      formItemLabel: "",
      formItemRequired: true,
      formItemLabelAlign: "",
      formItemLabelTooltip: "",
      formItemRequiredHint: "",
      hidden: false,
      wrapperCol: {},

      placeholder: "请输入",
      disabled: false,
      readonly: false,
      allowClear: true,
      defaultValue: "",
      autoSize: false, // 自适应内容高度
      minRows: null, // 最小行
      maxRows: null, // 最大行
      maxLength: null, // 最大长度
    },
  },
  {
    type: "dict-select",
    icon: "textarea-field",
    formItemFlag: true,
    useAsFormItem: true,
    settingForm: {
      labelWidth: "90px",
      labelAlign: "left",
    },
    props: {
      formItemField: "",
      formItemLabel: "",
      formItemRequired: true,
      formItemLabelAlign: "",
      formItemLabelTooltip: "",
      formItemRequiredHint: "",
      wrapperCol: {},
      allowClear: true,
      showSearch: true,

      // 宽度
      style: { width: "100%" },
      placeholder: "请选择",
      defaultValue: "",
      dictCompType: "radio", // 字典组件类型
      dictType: "data_use_status", // 字典
      valueToString: false,
      // checkbox属性
      dictColProps: {}
    },
  },
  {
    type: "divider",
    icon: "divider",
    formItemFlag: false,
    useAsFormItem: false,
    settingForm: {
      labelWidth: "90px",
      labelAlign: "left",
    },
    props: {
      formItemField: "",
      formItemLabel: "",
      formItemRequired: false,
      formItemLabelAlign: "",
      formItemLabelTooltip: "",
      hidden: false,

      // 宽度
      divider_style: { width: "100%" },
      direction: "center", // 方向
      directionMargin: null, // 标题和最近 left/right 边框之间的距离，去除了分割线，同时 orientation 必须为 left 或 right
      dashed: false, // 是否为虚线
    },
  },
  {
    type: "alert",
    icon: "alert-field",
    formItemFlag: false,
    useAsFormItem: false,
    settingForm: {
      labelWidth: "90px",
      labelAlign: "left",
    },
    props: {
      formItemField: "",
      formItemLabel: "",
      formItemRequired: false,
      formItemLabelAlign: "",
      formItemLabelTooltip: "",
      hidden: false,

      alertStyle: { width: "100%" },
      alertType: "info", // 类型
      alertMessage: "这是一个告警信息",
      showIcon: true,
    },
  },
  {
    type: "rate",
    icon: "rate-field",
    formItemFlag: true,
    settingForm: {
      labelWidth: "90px",
      labelAlign: "left",
    },
    props: {
      formItemField: "",
      formItemLabel: "",
      formItemRequired: false,
      formItemLabelAlign: "",
      formItemLabelTooltip: "",
      hidden: false,

      defaultValue: 0,
      // 自定义样式 fontSize
      rate_style: {},

      disabled: false,
      showCount: 5, // star 总数
      allowHalf: false, // 是否允许半选
      allowClear: true, // 是否允许再次点击后清除
      character: null, // 自定义字符
    },
  },
  {
    type: "switch",
    icon: "switch-field",
    formItemFlag: true,
    settingForm: {
      labelWidth: "90px",
      labelAlign: "left",
    },
    props: {
      formItemField: "",
      formItemLabel: "",
      formItemRequired: false,
      formItemLabelAlign: "",
      formItemLabelTooltip: "",
      hidden: false,
      wrapperCol: {},

      disabled: false,
      defaultValue: null,
      checkedValue: null, // 被选中时的值
      checkedText: null, // 被选中时显示文本
      unCheckedValue: null, // 未被选中时时的值
      unCheckedText: null, // 未被选中时显示文本
    },
  },

  {
    type: "number",
    icon: "number-field",
    formItemFlag: true,
    props: {
      name: "",
      label: "",
      labelAlign: "",
      defaultValue: 0,
      placeholder: "",
      columnWidth: "200px",
      size: "",
      labelWidth: null,
      labelHidden: false,
      disabled: false,
      hidden: false,
      required: false,
      requiredHint: "",
      validation: "",
      validationHint: "",
      wrapperCol: {},

      //-------------------
      customClass: "", //自定义css类名
      labelIconClass: null,
      labelIconPosition: "rear",
      labelTooltip: null,
      min: -100000000000,
      max: 100000000000,
      precision: 0,
      step: 1,
      controlsPosition: "right",
      //-------------------
      onCreated: "",
      onMounted: "",
      onChange: "",
      onFocus: "",
      onBlur: "",
      onValidate: "",
    },
  },

  {
    type: "radio",
    icon: "radio-field",
    formItemFlag: true,
    props: {
      name: "",
      label: "",
      labelAlign: "",
      defaultValue: null,
      columnWidth: "200px",
      size: "",
      displayStyle: "inline",
      buttonStyle: false,
      border: false,
      labelWidth: null,
      labelHidden: false,
      disabled: false,
      hidden: false,
      wrapperCol: {},
      optionItems: [
        { label: "radio 1", value: 1 },
        { label: "radio 2", value: 2 },
        { label: "radio 3", value: 3 },
      ],
      required: false,
      requiredHint: "",
      validation: "",
      validationHint: "",
      //-------------------
      customClass: "", //自定义css类名
      labelIconClass: null,
      labelIconPosition: "rear",
      labelTooltip: null,
      //-------------------
      onCreated: "",
      onMounted: "",
      onChange: "",
      onValidate: "",
    },
  },

  {
    type: "checkbox",
    icon: "checkbox-field",
    formItemFlag: true,
    props: {
      name: "",
      label: "",
      labelAlign: "",
      defaultValue: [],
      columnWidth: "200px",
      size: "",
      displayStyle: "inline",
      buttonStyle: false,
      border: false,
      labelWidth: null,
      labelHidden: false,
      disabled: false,
      hidden: false,
      wrapperCol: {},
      optionItems: [
        { label: "check 1", value: 1 },
        { label: "check 2", value: 2 },
        { label: "check 3", value: 3 },
      ],
      required: false,
      requiredHint: "",
      validation: "",
      validationHint: "",
      //-------------------
      customClass: "", //自定义css类名
      labelIconClass: null,
      labelIconPosition: "rear",
      labelTooltip: null,
      //-------------------
      onCreated: "",
      onMounted: "",
      onChange: "",
      onValidate: "",
    },
  },

  {
    type: "select",
    icon: "select-field",
    formItemFlag: true,
    props: {
      name: "",
      label: "",
      labelAlign: "",
      defaultValue: "",
      placeholder: "",
      columnWidth: "200px",
      size: "",
      labelWidth: null,
      labelHidden: false,
      disabled: false,
      hidden: false,
      clearable: true,
      filterable: false,
      allowCreate: false,
      remote: false,
      automaticDropdown: false, //自动下拉
      multiple: false,
      multipleLimit: 0,
      wrapperCol: {},
      optionItems: [
        { label: "select 1", value: 1 },
        { label: "select 2", value: 2 },
        { label: "select 3", value: 3 },
      ],
      required: false,
      requiredHint: "",
      validation: "",
      validationHint: "",
      //-------------------
      customClass: "", //自定义css类名
      labelIconClass: null,
      labelIconPosition: "rear",
      labelTooltip: null,
      //-------------------
      onCreated: "",
      onMounted: "",
      onRemoteQuery: "",
      onChange: "",
      onFocus: "",
      onBlur: "",
      onValidate: "",
    },
  },

  {
    type: "time",
    icon: "time-field",
    formItemFlag: true,
    props: {
      name: "",
      label: "",
      labelAlign: "",
      defaultValue: null,
      placeholder: "",
      columnWidth: "200px",
      size: "",
      autoFullWidth: true,
      labelWidth: null,
      labelHidden: false,
      readonly: false,
      disabled: false,
      hidden: false,
      clearable: true,
      editable: false,
      format: "HH:mm:ss", //时间格式
      required: false,
      requiredHint: "",
      validation: "",
      validationHint: "",
      wrapperCol: {},
      //-------------------
      customClass: "", //自定义css类名
      labelIconClass: null,
      labelIconPosition: "rear",
      labelTooltip: null,
      //-------------------
      onCreated: "",
      onMounted: "",
      onChange: "",
      onFocus: "",
      onBlur: "",
      onValidate: "",
    },
  },

  {
    type: "time-range",
    icon: "time-range-field",
    formItemFlag: true,
    props: {
      name: "",
      label: "",
      labelAlign: "",
      defaultValue: null,
      startPlaceholder: "",
      endPlaceholder: "",
      columnWidth: "200px",
      size: "",
      autoFullWidth: true,
      labelWidth: null,
      labelHidden: false,
      readonly: false,
      disabled: false,
      hidden: false,
      clearable: true,
      editable: false,
      format: "HH:mm:ss", //时间格式
      required: false,
      requiredHint: "",
      validation: "",
      validationHint: "",
      wrapperCol: {},
      //-------------------
      customClass: "", //自定义css类名
      labelIconClass: null,
      labelIconPosition: "rear",
      labelTooltip: null,
      //-------------------
      onCreated: "",
      onMounted: "",
      onChange: "",
      onFocus: "",
      onBlur: "",
      onValidate: "",
    },
  },

  {
    type: "date",
    icon: "date-field",
    formItemFlag: true,
    props: {
      name: "",
      label: "",
      labelAlign: "",
      type: "date",
      defaultValue: null,
      placeholder: "",
      columnWidth: "200px",
      size: "",
      autoFullWidth: true,
      labelWidth: null,
      labelHidden: false,
      readonly: false,
      disabled: false,
      hidden: false,
      clearable: true,
      editable: false,
      format: "YYYY-MM-DD", //日期显示格式
      valueFormat: "YYYY-MM-DD", //日期对象格式
      required: false,
      requiredHint: "",
      validation: "",
      validationHint: "",
      wrapperCol: {},
      //-------------------
      customClass: "", //自定义css类名
      labelIconClass: null,
      labelIconPosition: "rear",
      labelTooltip: null,
      //-------------------
      onCreated: "",
      onMounted: "",
      onChange: "",
      onFocus: "",
      onBlur: "",
      onValidate: "",
    },
  },

  {
    type: "date-range",
    icon: "date-range-field",
    formItemFlag: true,
    props: {
      name: "",
      label: "",
      labelAlign: "",
      type: "daterange",
      defaultValue: null,
      startPlaceholder: "",
      endPlaceholder: "",
      columnWidth: "200px",
      size: "",
      autoFullWidth: true,
      labelWidth: null,
      labelHidden: false,
      readonly: false,
      disabled: false,
      hidden: false,
      clearable: true,
      editable: false,
      format: "YYYY-MM-DD", //日期显示格式
      valueFormat: "YYYY-MM-DD", //日期对象格式
      required: false,
      requiredHint: "",
      validation: "",
      validationHint: "",
      wrapperCol: {},
      //-------------------
      customClass: "", //自定义css类名
      labelIconClass: null,
      labelIconPosition: "rear",
      labelTooltip: null,
      //-------------------
      onCreated: "",
      onMounted: "",
      onChange: "",
      onFocus: "",
      onBlur: "",
      onValidate: "",
    },
  },

  {
    type: "color",
    icon: "color-field",
    formItemFlag: true,
    props: {
      name: "",
      label: "",
      labelAlign: "",
      defaultValue: null,
      columnWidth: "200px",
      size: "",
      labelWidth: null,
      labelHidden: false,
      disabled: false,
      hidden: false,
      required: false,
      requiredHint: "",
      validation: "",
      validationHint: "",
      wrapperCol: {},
      //-------------------
      customClass: "", //自定义css类名
      labelIconClass: null,
      labelIconPosition: "rear",
      labelTooltip: null,
      //-------------------
      onCreated: "",
      onMounted: "",
      onChange: "",
      onValidate: "",
    },
  },

  {
    type: "slider",
    icon: "slider-field",
    formItemFlag: true,
    props: {
      name: "",
      label: "",
      labelAlign: "",
      columnWidth: "200px",
      showStops: true,
      size: "",
      labelWidth: null,
      labelHidden: false,
      disabled: false,
      hidden: false,
      required: false,
      requiredHint: "",
      validation: "",
      validationHint: "",
      wrapperCol: {},
      //-------------------
      customClass: "", //自定义css类名
      labelIconClass: null,
      labelIconPosition: "rear",
      labelTooltip: null,
      min: 0,
      max: 100,
      step: 10,
      range: false,
      //vertical: false,
      height: null,
      //-------------------
      onCreated: "",
      onMounted: "",
      onChange: "",
      onValidate: "",
    },
  },

  {
    type: "static-text",
    icon: "static-text",
    formItemFlag: false,
    props: {
      name: "",
      columnWidth: "200px",
      hidden: false,
      textContent: "static text",
      textAlign: "left",
      fontSize: "13px",
      wrapperCol: {},
      preWrap: false, //是否自动换行
      //-------------------
      customClass: "", //自定义css类名
      //-------------------
      onCreated: "",
      onMounted: "",
    },
  },

  {
    type: "html-text",
    icon: "html-text",
    formItemFlag: false,
    props: {
      name: "",
      columnWidth: "200px",
      hidden: false,
      htmlContent: "<b>html text</b>",
      //-------------------
      customClass: "", //自定义css类名
      //-------------------
      onCreated: "",
      onMounted: "",
    },
  },

  {
    type: "button",
    icon: "button",
    formItemFlag: false,
    props: {
      name: "",
      label: "",
      columnWidth: "200px",
      size: "",
      displayStyle: "block",
      disabled: false,
      hidden: false,
      type: "",
      plain: false,
      round: false,
      circle: false,
      icon: null,
      //-------------------
      customClass: "", //自定义css类名
      //-------------------
      onCreated: "",
      onMounted: "",
      onClick: "",
    },
  },

  //
]

export const advancedFields = [
  {
    type: "picture-upload",
    icon: "picture-upload-field",
    formItemFlag: true,
    options: {
      name: "",
      label: "",
      labelAlign: "",
      labelWidth: null,
      labelHidden: false,
      columnWidth: "200px",
      disabled: false,
      hidden: false,
      required: false,
      requiredHint: "",
      customRule: "",
      customRuleHint: "",
      //-------------------
      uploadURL: "",
      uploadTip: "",
      withCredentials: false,
      multipleSelect: false,
      showFileList: true,
      limit: 3,
      fileMaxSize: 5, //MB
      fileTypes: ["jpg", "jpeg", "png"],
      //headers: [],
      //-------------------
      customClass: "", //自定义css类名
      labelIconClass: null,
      labelIconPosition: "rear",
      labelTooltip: null,
      //-------------------
      onCreated: "",
      onMounted: "",
      onBeforeUpload: "",
      onUploadSuccess: "",
      onUploadError: "",
      onFileRemove: "",
      onValidate: "",
      //onFileChange: '',
    },
  },

  {
    type: "file-upload",
    icon: "file-upload-field",
    formItemFlag: true,
    options: {
      name: "",
      label: "",
      labelAlign: "",
      labelWidth: null,
      labelHidden: false,
      columnWidth: "200px",
      disabled: false,
      hidden: false,
      required: false,
      requiredHint: "",
      customRule: "",
      customRuleHint: "",
      //-------------------
      uploadURL: "",
      uploadTip: "",
      withCredentials: false,
      multipleSelect: false,
      showFileList: true,
      limit: 3,
      fileMaxSize: 5, //MB
      fileTypes: ["doc", "docx", "xls", "xlsx"],
      //headers: [],
      //-------------------
      customClass: "", //自定义css类名
      labelIconClass: null,
      labelIconPosition: "rear",
      labelTooltip: null,
      //-------------------
      onCreated: "",
      onMounted: "",
      onBeforeUpload: "",
      onUploadSuccess: "",
      onUploadError: "",
      onFileRemove: "",
      onValidate: "",
      //onFileChange: '',
    },
  },

  {
    type: "rich-editor",
    icon: "rich-editor-field",
    formItemFlag: true,
    options: {
      name: "",
      label: "",
      labelAlign: "",
      placeholder: "",
      labelWidth: null,
      labelHidden: false,
      columnWidth: "200px",
      contentHeight: "200px",
      disabled: false,
      hidden: false,
      required: false,
      requiredHint: "",
      customRule: "",
      customRuleHint: "",
      //-------------------
      customClass: "", //自定义css类名
      labelIconClass: null,
      labelIconPosition: "rear",
      labelTooltip: null,
      minLength: null,
      maxLength: null,
      showWordLimit: false,
      //-------------------
      onCreated: "",
      onMounted: "",
      onValidate: "",
    },
  },

  {
    type: "cascader",
    icon: "cascader-field",
    formItemFlag: true,
    options: {
      name: "",
      label: "",
      labelAlign: "",
      defaultValue: "",
      placeholder: "",
      size: "",
      labelWidth: null,
      labelHidden: false,
      columnWidth: "200px",
      disabled: false,
      hidden: false,
      clearable: true,
      filterable: false,
      multiple: false,
      checkStrictly: false, //可选择任意一级选项，默认不开启
      showAllLevels: true, //显示完整路径
      optionItems: [
        { label: "select 1", value: 1, children: [{ label: "child 1", value: 11 }] },
        { label: "select 2", value: 2 },
        { label: "select 3", value: 3 },
      ],
      required: false,
      requiredHint: "",
      customRule: "",
      customRuleHint: "",
      //-------------------
      customClass: "", //自定义css类名
      labelIconClass: null,
      labelIconPosition: "rear",
      labelTooltip: null,
      //-------------------
      onCreated: "",
      onMounted: "",
      onChange: "",
      onFocus: "",
      onBlur: "",
      onValidate: "",
    },
  },
]

export const customFields = []

export function addContainerWidgetSchema(containerSchema) {
  containers.push(containerSchema)
}

export function addBasicFieldSchema(fieldSchema) {
  basicFields.push(fieldSchema)
}

export function addAdvancedFieldSchema(fieldSchema) {
  advancedFields.push(fieldSchema)
}

export function addCustomWidgetSchema(widgetSchema) {
  customFields.push(widgetSchema)
}

export const allWidgets = [...containers, ...basicFields, ...advancedFields, ...customFields]
